<template>
  <div class="home-recommend">
    <home-title title="精彩推荐" />
    <div v-if="datas.length" class="u-p-t-8">
      <ProCard v-for="(info,index) in datas" :key="index" :info="info" @click="$emit('jumpDetail',{ path: '/pageCase/detail?id=' + info.id })" />
    </div>
    <!--<div v-else class="empty-box">-->
    <!--  <uni-empty-->
    <!--    icon-size="350"-->
    <!--    src="https://img-cdn.rsm-lab.com/mlab/mlab-wxapp/image/empty/normal.png"-->
    <!--  />-->
    <!--</div>-->

  </div>
</template>

<script setup lang="ts">
import HomeTitle from './HomeTitle.vue';

defineProps({
  datas: {
    type: Array,
    default: () => {
      return []
    }
  }
})
</script>

<style lang="scss" scoped>
.home-recommend {
  padding: 10px 0;
  ::v-deep .pro-card {
    border-color: #EEEEEE;
  }
  .content {
    padding: 8px;
    .item {
      display: flex;
      flex-direction: column;
      align-items: center;
      border-radius: 4px;
      height: 170px;
      width: 113px;
      border: 1px solid #EEEEEE;
      .banner {
        width: 111px;
        height: 111px;
        img {
          width: 100%;
          height: 100%;
        }
      }
      .name {
        font-weight: bold;
        color: #111;
        font-size: 14px;
        margin-top: 6px;
      }
      .title {
        font-size: 12px;
        color: #999;
        margin-top: 6px;
      }
    }
  }
}
.empty-box {
    margin-top: 80px;
    ::v-deep .u-icon__label{
      color:  transparent !important;
    }
}
</style>
